.union-info {
  border: 1px solid #e7e7eb;
  position: relative;
    
  >div.info-hd {
    background: #f4f5f9;
    line-height: 36px;
    padding: 0 15px;
    border-bottom: 1px solid #e7e7eb;
    
    a.icon {
      color: #999;
      cursor: help;
    }
  }
  
  >div.info-bd {
    padding: 20px;
    
    div {
      text-align: center;
      border-right: 1px solid #e7e7eb;
      > p {
        line-height: 30px;
      }
      
      > h4 {
        line-height: 30px;
      }
      
      
      &:last-child {
        border-right: 0;
      }
    }
  }
  
  > .info-qrcode {
    position: absolute;
    text-indent: -9999em;
    right: 0;
    bottom: 0;
    background: url('../images/qrcode-demo.png') no-repeat center center;
    background-size: 25px;
    width: 35px;
    height: 35px;
  }
  
}

.union-info-tip {
  border: 1px solid #e7e7eb;
  background: #f4f5f9;
  line-height: 36px;
  padding: 0 5px 0 15px;
  margin-top: 30px;
  
  > form {
    float: right;
    padding-top: 5px;
    
    > span {
      line-height: 30px;
      padding: 0 6px;
    }
    
    > .input {
      padding: 3px 8px;
      float: left;
      line-height: 27px;
      height: 27px;
      width: 103px;
      font-size: 12px;
      font-weight: normal;
    }
    
    > .btn-submit {
      padding: 5px 10px 6px;
      font-weight: normal;
      font-size: 12px;
      border-radius: 0;
      margin-left: 5px;
    }
  }
}

.union_box {
  position: relative;
  
  .is-closed-bg {
    background: #000000;
    @include opacity(0.4);
  }
  
  .is-closed-bg, .is-closed-info {
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    position: absolute;
  }
  
  .is-closed-info {
    padding-top: 125px;
    z-index: 100;
    text-align: center;
    
    > h3 {
      color: #FFF;
      font-weight: normal;
      margin-bottom: 30px;
    }
  }
}